var an = document.querySelectorAll(".an > li");
var t = document.querySelectorAll(".tt > div");

for(var i = 0;i<an.length;i++){
    an[i].index = i;
    an[i].addEventListener("click",function(){
        for(var j = 0;j<an.length;j++){
            an[j].classList.remove("active");
            t[j].classList.remove("active")
        }
        this.classList.add("active");
        t[this.index].classList.add("active")
    })

}


var dian1 = document.querySelector("#dian");
function a(){
    dian1.style.display = "none";
}

var text = document.querySelector("#text");
var button2 = document.querySelector("#button");
var r1 = document.querySelector("#r1");
var r2 = document.querySelector("#r2");


button2.addEventListener("click",function(){
    if(text.value == ""){
        alert("请输入需添加的任务");
    }else {
        //创建节点
        var li = document.createElement("li");
        var button = document.createElement("button");
        var p = document.createElement("p");
        var span = document.createElement("span");


        //添加节点
        r1.appendChild(li);
        li.appendChild(button);
        li.appendChild(p);
        li.appendChild(span);

        p.innerHTML = text.value;
        text.value = "";

        //创建节点
        var li1 = document.createElement("li");
        var button1 = document.createElement("button");
        var p1 = document.createElement("p");
        var span1 = document.createElement("span");


        //添加节点
        r2.appendChild(li1);
        li1.appendChild(button1);
        li1.appendChild(p1);
        li1.appendChild(span1);

        p1.innerHTML = p.innerHTML;

        button.addEventListener("click", function () {
            li.style.display = "none";
            li1.style.display = "inline-block";
            button1.innerHTML = "✔"
        });


        button1.addEventListener("click",function(){
            li1.style.display = "none";
            li.style.display = "inline-block";
            button.innerHTML = ""
        });

        span.addEventListener("click",function(){
            li.style.display = "none"
        });

        span1.addEventListener("click", function () {
            li1.style.display = "none"
        })


    }

});





